import React from 'react';
import './CommonImagesGrid.css';

const images = [
  {
    src: '//js.ibaotu.com//act/25/07/17/6878aa43ee5af.jpg',
    tag: '实拍视频',
    title: '海岛度假',
  },
  {
    src: '//js.ibaotu.com//act/25/07/17/6878aa8471fd8.jpg',
    tag: '视频模板',
    title: '乘风启航 追梦前行',
  },
  {
    src: '//js.ibaotu.com//act/25/07/17/6878aab6c90eb.jpg',
    tag: '实拍视频',
    title: '夏日清凉饮品',
  },
  {
    src: '//js.ibaotu.com//act/25/07/17/6878aac263d8e.jpg',
    tag: '设计模板',
    title: '三伏天（出逃计划）',
  },
  {
    src: '//js.ibaotu.com//act/25/07/17/6878ab644dd95.jpg',
    tag: '设计模板',
    title: '夏天趣哪浪',
  },
  {
    src: '//js.ibaotu.com//act/25/07/17/6878abd2a4572.jpg',
    tag: '设计模板',
    title: '狂暑季钜惠来袭',
  },
];

const CommonImagesGrid: React.FC = () => (
  <div className="common-images-grid">
    {images.map((img, idx) => (
      <div className="img-card" key={idx}>
        <img src={img.src} alt={img.title} className="img-main" />
        <span className="img-tag">{img.tag}</span>
        <div className="img-title">{img.title}</div>
      </div>
    ))}
  </div>
);

export default CommonImagesGrid; 